import React from 'react';
import { Text, View } from 'native-base';
import { StyleSheet, TouchableOpacity } from 'react-native';
import { CommonStyle } from '../../../../../common/commonStyle.ts';
import AntDesign from 'react-native-vector-icons/AntDesign';
import HomeProductListItem from './HomeProductListItem.tsx';

interface IListProductTemplateProps {
  data: IProductList;
  title: string;
  styleType: number;
}

const ListProductTemplate: React.FC<IListProductTemplateProps> = (props) => {
  return (
    <View style={styles.container}>
      <View style={styles.top}>
        <Text fontWeight={'bold'}>{props.title}</Text>
        <TouchableOpacity style={{ flexDirection: 'row', alignItems: 'center' }}>
          <Text color={CommonStyle.deepGrey} fontSize={12} mr={1}>
            更多服务
          </Text>
          <AntDesign name={'right'} style={{ height: 12 }} />
        </TouchableOpacity>
      </View>

      <HomeProductListItem goods={props.data.btnListVos} styleType={props.styleType} />
    </View>
  );
};

const styles = StyleSheet.create({
  container: { flex: 1, backgroundColor: '#fff', paddingHorizontal: 8, paddingTop: 12 },
  top: { flexDirection: 'row', justifyContent: 'space-between', marginBottom: 14 },
});

export default ListProductTemplate;
